<template>
  <div>
    <div
      id="box"
      contentEditable
    >我是p标签的内容</div>
    <button id="saveBtn">记录光标位置</button>
    <button id="restoreBtn">恢复光标位置</button>
  </div>
</template>
<script>
export default {
  data: () => ({
    range: null
  }),
  methods: {
    saveSelection(){
      if(window.getSelection) {
				const sel = window.getSelection();
				if(sel.getRangeAt && sel.rangeCount) {
					return sel.getRangeAt(0);
				}
			} else if(document.selection && document.selection.createRange) {
				return document.selection.createRange();
			}
			return null;
    },
    restoreSelection(range){
      	if(range) {
				if(window.getSelection) {
					sel = window.getSelection();
					sel.removeAllRanges();
					sel.addRange(range);
				} else if(document.selection && range.select) {
					range.select();
				}
			}
————————————————
版权声明：本文为CSDN博主「codingWeb」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/fesfsefgs/article/details/109540259
    }
  }
}
</script>
<style lang="scss" scoped>
</style>